<!--
 * @Descripttion: HN-SaaS管理系统
 * @version: 1.0.0
 * @Author: 侯建军
 * @Date: 2020-09-08 10:10:52
 * @LastEditors: 侯建军
 * @LastEditTime: 2020-09-09 15:42:01
-->
<template>
  <div>
    <div class="addPatient">
      <el-button type="primary" @click="addPatient">添加患者</el-button>
    </div>
    <!-- 患者信息 -->
    <el-table :data="patientData" style="width: 100%">
      <el-table-column prop="name" label="姓名" sortable width="180"></el-table-column>
      <el-table-column prop="gender" label="性别" width="180">
        <template slot-scope="scope">
          <el-tag
            :type="scope.row.gender == '0' ? 'success' : 'danger'"
            close-transition
          >{{scope.row.gender=='0'?'男':'女'}}</el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="idcard" label="身份证号" :formatter="formatter"></el-table-column>
      <el-table-column prop="birth" label="出生年月" sortable width="180"></el-table-column>
      <el-table-column prop="createDate" label="创建日期" sortable width="180"></el-table-column>
    </el-table>
    <!-- 分页插件 -->
    <el-pagination
      small
      layout="prev, pager, next"
      @current-change="handleCurrentChange"
      :current-page="patientParam.currentPage"
      :page-size="patientParam.pageSize"
      :total="total"
    ></el-pagination>
    <!-- 添加患者 -->
    <!-- 挂号信息对话框 -->
    <AddPatient :dialogVisible="dialogVisible" @close="close" />
  </div>
</template>

<script>
import { getPatients } from "@/api/patient.js";
import AddPatient from "@/views/patient/AddPatient.vue";

export default {
  name: "",
  components: {
    AddPatient,
  },
  data() {
    return {
      dialogVisible: false,
      patientParam: { currentPage: 1, pageSize: 10 },
      patientData: [],
      total: 0,
    };
  },
  created() {
    this.loadData();
  },
  methods: {
    loadData() {
      getPatients(this.patientParam).then((res) => {
        console.log(res);
        if (res.data.code === "0000") {
          this.patientData = res.data.data.records;
          this.total = Number.parseInt(res.data.data.total);
        }
      });
    },
    formatter(row, column) {
      return row.address;
    },
    filterTag(value, row) {
      return row.tag === value;
    },
    addPatient() {
      this.dialogVisible = true;
    },
    close() {
      this.dialogVisible = false;
      this.loadData();
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      this.patientParam.currentPage = val;
      this.loadData();
      console.log(`当前页: ${val}`);
    },
  },
};
</script>


<style lang="scss" scoped>
.addPatient {
  text-align: left;
  margin-bottom: 10px;
}
</style>